<template>
  <div id="soluteTask">
    <div class="bg_nav">
      <div class="content">
        <div class="left">
          <div v-for="(item,index) in list" :key="index" class="item" :style="{'marginLeft':index!=0&&index%3>0?'3%':'0'}">
            <img :src="item.icon" alt="">
            <span>{{item.title}}</span>
            <div>{{item.desc}}</div>
          </div>
        </div>
        <div class="right">
          <div class="price">站外种草低至￥7.9/篇</div>
          <div class="title">多平台一站式</div>
          <div class="title">内容营销解决方案</div>
          <div class="desc">提供一站式精细化内容营销方案，专属团队不断深研服务推荐机制，定制品牌营销方案</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import '@/assets/css/soluteTask.css'
export default {
  name: 'soluteTask',
  data () {
    return {
        list:[{
          title:'小红书推广',
          desc:'头部KOL+海量KOC组合种草推广，品牌实现发现-关注-认可-转化',
          icon:require('@/assets/01/soluteTask/redbook.png')
        },{
          title:'抖音推广',
          desc:'移动互联网亿级活跃流量加持，对接抖音垂直类目KOL直播+KOC内容创作私域传播',
          icon:require('@/assets/01/soluteTask/douyin.png')
        },{
          title:'微博推广',
          desc:'通过目标品牌个性微博红人发布软广微博，全面覆盖6亿微博用户，多维度数据监测实时反馈',
          icon:require('@/assets/01/soluteTask/weibo.png')
        },{
          title:'抖店运营',
          desc:'品牌小店代运营，视频创作分发，鲁班及巨量推广、活动策划、智能营销及站外推广等一站式运营服务',
          icon:require('@/assets/01/soluteTask/yunying.png')
        },{
          title:'内容创作',
          desc:'专业内容创作深度合作，包含活动策划，高质量软文原创制作，站内外内容投放策划',
          icon:require('@/assets/01/soluteTask/chuangzuo.png')
        },{
          title:'数据洞察',
          desc:'大数据洞察,定制策划方案;投放内容数据分析,运营数据实时反馈',
          icon:require('@/assets/01/soluteTask/dongcha.png')
        }],
        height:document.body.clientHeight || document.documentElement.clientHeight
    }
  },
  methods:{
      pageResize(){
          this.height=document.body.clientHeight || document.documentElement.clientHeight
      },
      _isMobile() {
        let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
        return flag;
      },
      handleLogin(){
         if (this._isMobile()) {
            this.$Modal.confirm({
                title: '提示',
                content: '暂不支持移动端设备,请到PC端打开',
                okText: '确定',
                cancelText: '取消'
            })
        }else{
            window.open('https://cloud.redsay.net/login/1')
        }
        },
  },
  created(){
  },
  mounted(){
    var that=this
    window.onresize = ()=>{
　　　　//调用methods中的事件
        that.pageResize();
    } 
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
